.layout-box {
  display: flex;
	min-width: 950px;
	height: 100%;

  .ant-layout-sider {
		box-sizing: border-box;
	}

  .ant-layout {
		/* 防止 tabs 超出不收缩 */
		overflow-x: hidden;
		.ant-layout-content {
			box-sizing: border-box;
			flex: 1;
			padding: 10px 12px;
			overflow-x: hidden;
		}
	}
}


/* layout-box */
.layout-box {
	/* sider */
	.ant-layout-sider {
		border-right: 1px solid var(--border-color) !important;

		.ant-menu {
			&::-webkit-scrollbar {
				background-color: #001529 !important;
			}

			&::-webkit-scrollbar-thumb {
				background-color: #41444b !important;
			}
		}

		.logo-box {
			border-bottom: 1px solid #010b14 !important;
		}
	}

	/* layout */
	.ant-layout {
		background-color: var(--main-bg-color) !important;

		.tabs,
		.footer,
		.card {
			background-color: var(--bg-color) !important;
			border-color: var(--border-color) !important;
		}

		.ant-layout-header {
			height: 55px;
			padding: 0 40px 0 20px;
			background-color: var(--bg-color) !important;
			border-color: var(--border-header-color) !important;

			.icon-style,
			.username {
				color: var(--text-color) !important;
			}
		}

		.footer {
			a {
				color: var(--text-color) !important;
			}
		}

		.card {
			box-shadow: var(--shadow-color) !important;

			.text {
				color: #585858 !important;
			}
		}

		.ant-layout-content {
			&::-webkit-scrollbar {
				background-color: var(--main-bg-color) !important;
			}

			&::-webkit-scrollbar-thumb {
				background-color: var(--scrollbar-bg-color) !important;
			}

			.card {
				&::-webkit-scrollbar {
					background-color: var(--bg-color) !important;
				}

				&::-webkit-scrollbar-thumb {
					background-color: var(--scrollbar-bg-color) !important;
				}
			}
		}
	}
}